<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./bootstrap5/css/bootstrap.min.css">
    <link rel="stylesheet/less" href="./css/common.less"> <!--公共样式 -->
    <link rel="stylesheet/less" href="./css/project.less"><!--独立样式-->
    <title>项目文件</title>
</head>

<body>
    <header>
        <div class="container">
            <nav class="navbar navbar-expand-lg">
                <div class="container-fluid">
                    <a class="navbar-brand logoNav" href="#">
                        <img src="./img/Logo.png" alt="Logo" class="d-inline-block align-text-top">
                    </a>
                    <button class="navbar-toggler" type="button" data-bs-toggle="collapse"
                        data-bs-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false"
                        aria-label="Toggle navigation">
                        <span class="navbar-toggler-icon"></span>
                    </button>
                    <div class="collapse navbar-collapse" id="navbarNavAltMarkup">
                        <a class="navbar-brand" href="#">
                            <img src="./img/Logo.png" alt="Logo" class="d-inline-block align-text-top">
                        </a>
                        <div class="navbar-nav">
                            <a class="nav-link" href="./index.html">落地页</a>
                            <a class="nav-link" href="./project.html">项目文件</a>
                            <a class="nav-link" href="./blog.html">博客</a>
                            <a class="nav-link" href="./service.html">我们的服务</a>
                            <a class="nav-link" href="./about.html">关于我们</a>
                        </div>
                        <div class="navbar-nav loginNav">
                            <a class="nav-link " id="login" href="./login.html">登录</a>
                            <a class="nav-link " id="register" href="./register.html">注册</a>
                        </div>
                    </div>
                </div>
            </nav>
        </div>
    </header>
    <div class="banner">
        <img src="./img/banner2.png" class="w-100 h-100" alt="">
        <div class="banner_text">
            <h1>Web网站设计</h1>
            <p class="d-none d-lg-block">领导一个组织是令人难以置信的回报， 自信和谦逊。 每一次成功都是建立在错误的基础上的。</p>
            <span class="d-none d-sm-block">首页 &gt; 项目文件</span>
        </div>
    </div>
    <div class="module1">
        <div class="container">
            <div class="row pic">
                <img src="./img/project_m1_1.png" class="w-100" alt="">
            </div>
            <div class="row content">
                <div class="col-md-6 col-10 mx-auto left">
                    <h6>项目介绍：</h6>
                    <p>通过访问我们并下订单，您确认您同意并受我们整个网站概述的使用条款中包含的条款和条件以及您与我们之间的任何电子邮件通信的约束。
                        使用下面概述的整个网站电子邮件。通过访问我们并下订单，您确认您同意并受我们整个网站概述的使用条款中包含的条款和条件以及您与我们之间的任何电子邮件通信的约束。</p>
                    <div class="choose">
                        <span>&lt; 上一项目</span>
                        <span>下一项目 &gt;</span>
                    </div>
                </div>
                <div class="col-md-6 col-10 mx-auto right">
                    <div class="item mb-3 mb-md-0">
                        <span class="title_name">用户：</span>
                        <span class="info">金金设计素材铺</span>
                    </div>
                    <div class="item mb-3 mb-md-0">
                        <span class="title_name">完成时间：</span>
                        <span class="info">2021-11-12</span>
                    </div>
                    <div class="item mb-3 mb-md-0">
                        <span class="title_name">分类：</span>
                        <span class="info">Web设计</span>
                    </div>
                    <div class="item mb-3 mb-md-0">
                        <span class="title_name">时间周期：</span>
                        <span class="info">2周</span>
                    </div>
                    <div class="item mb-3 mb-md-0">
                        <span class="title_name">网址：</span>
                        <span class="info">xxxxxxxxxx.xxxx.xxx</span>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="module2">
        <div class="container">
            <h1>相关项目</h1>
            <div id="carouselExample" class="carousel slide">
                <div class="carousel-inner">
                    <div class="carousel-item active">
                        <div class="row">
                            <img src="./img/project_m2_1.png" class="col-md-3 col-sm-6 col-8 mx-auto mb-4 mb-md-0" alt="...">
                            <img src="./img/project_m2_2.png" class="col-md-3 col-sm-6 col-8 mx-auto mb-4 mb-md-0" alt="...">
                            <img src="./img/project_m2_3.png" class="col-md-3 col-sm-6 col-8 mx-auto mb-4 mb-md-0" alt="...">
                            <img src="./img/project_m2_4.png" class="col-md-3 col-sm-6 col-8 mx-auto mb-4 mb-md-0" alt="...">
                        </div>
                    </div>
                    <div class="carousel-item">
                        <div class="row">
                            <img src="./img/project_m2_1.png" class="col-md-3 col-sm-6 col-8 mx-auto mb-4 mb-md-0" alt="...">
                            <img src="./img/project_m2_2.png" class="col-md-3 col-sm-6 col-8 mx-auto mb-4 mb-md-0" alt="...">
                            <img src="./img/project_m2_3.png" class="col-md-3 col-sm-6 col-8 mx-auto mb-4 mb-md-0" alt="...">
                            <img src="./img/project_m2_4.png" class="col-md-3 col-sm-6 col-8 mx-auto mb-4 mb-md-0" alt="...">
                        </div>
                    </div>
                </div>
                <button class="carousel-control-prev" type="button" data-bs-target="#carouselExample"
                    data-bs-slide="prev">
                    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                    <span class="visually-hidden">Previous</span>
                </button>
                <button class="carousel-control-next" type="button" data-bs-target="#carouselExample"
                    data-bs-slide="next">
                    <span class="carousel-control-next-icon" aria-hidden="true"></span>
                    <span class="visually-hidden">Next</span>
                </button>
            </div>
        </div>
    </div>
    <footer>
        <div class="container">
            <div class="row">
                <div class="col-lg-3 col-sm-6 col-10 mx-auto text-center text-sm-start mb-4 mb-lg-0 left">
                    <img src="./img/Logo_index.png" alt="">
                    <p>公司信息文字示例最多显示显示，当我们回顾2020，我们看到了什么？在一探究竟的执拗中挑战科学极限，以寸步不让的果敢打造科技力量，用天马星空创造共享。</p>
                    <img src="./img/footer1.png" alt="">
                </div>
                <div class="col-lg-2 col-sm-6 col-10 mx-auto text-center text-sm-start  mb-4  mb-lg-0">
                    <div class="title">服务</div>
                    <div class="item">文字示例信息</div>
                    <div class="item">安全托管</div>
                    <div class="item">检查网站网址</div>
                    <div class="item">安全密码设置</div>
                </div>
                <div class="col-lg-2 col-sm-6 col-10 mx-auto text-center text-sm-start mb-4 mb-lg-0">
                    <div class="title">关于我们</div>
                    <div class="item">付款计划</div>
                    <div class="item">让储蓄更多</div>
                    <div class="item">税收计算器</div>
                    <div class="item">关于我们</div>
                </div>
                <div class="col-lg-3 col-sm-6 col-10 mx-auto text-center text-sm-start mb-4 mb-lg-0">
                    <div class="title">联系我们</div>
                    <div class="item">地址示例最多显示两行可折行北京市海淀区中关村</div>
                    <div class="item">电话：010-57500000</div>
                    <div class="pic">
                        <img src="./img/footer2.png" alt="">
                        <img src="./img/footer3.png" alt="">
                    </div>
                </div>
            </div>
        </div>
        <div class="end">
            © 2021 copyright All Rights Reserved.demo
        </div>
    </footer>
    <script src="./js/less-4.1.3.js"></script>
    <script src="./bootstrap5/js/bootstrap.bundle.min.js"></script>
</body>

</html>